<!DOCTYPE html>
<html lang="en">
<head>
    
    <meta charset="utf-8">
    <title>utils/axis.js - Documentation</title>
    
    
    <script src="scripts/prettify/prettify.js"></script>
    <script src="scripts/prettify/lang-css.js"></script>
    <link type="text/css" rel="stylesheet" href="styles/prettify.css">
    <link type="text/css" rel="stylesheet" href="styles/jsdoc.css">
    <script src="scripts/nav.js" defer></script>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>

<input type="checkbox" id="nav-trigger" class="nav-trigger" />
<label for="nav-trigger" class="navicon-button x">
  <div class="navicon"></div>
</label>

<label for="nav-trigger" class="overlay"></label>

<nav >
    
    <h2><a href="index.html">Home</a></h2><h3>Modules</h3><ul><li><a href="module-$ui_charts_my-chart.html">$ui/charts/my-chart</a></li></ul><h3>Global</h3><ul><li><a href="global.html#baseSeries">baseSeries</a></li><li><a href="global.html#columnsToStandard">columnsToStandard</a></li><li><a href="global.html#createAxis">createAxis</a></li><li><a href="global.html#createDataset">createDataset</a></li><li><a href="global.html#createDimensions">createDimensions</a></li><li><a href="global.html#createPieSeries">createPieSeries</a></li><li><a href="global.html#createSeries">createSeries</a></li><li><a href="global.html#createSource">createSource</a></li><li><a href="global.html#DEFAULT_THEME">DEFAULT_THEME</a></li><li><a href="global.html#formatValue">formatValue</a></li><li><a href="global.html#getDataByLevel">getDataByLevel</a></li><li><a href="global.html#getLabelConfig">getLabelConfig</a></li><li><a href="global.html#getLabelFormatter">getLabelFormatter</a></li><li><a href="global.html#getLevelPieRadius">getLevelPieRadius</a></li><li><a href="global.html#getLimitRows">getLimitRows</a></li><li><a href="global.html#getNeedTransformColumnIndexes">getNeedTransformColumnIndexes</a></li><li><a href="global.html#getStackName">getStackName</a></li><li><a href="global.html#injectLabel">injectLabel</a></li><li><a href="global.html#PIE_LABEL_LINE">PIE_LABEL_LINE</a></li><li><a href="global.html#PIE_ROSE_ITEM_STYLE">PIE_ROSE_ITEM_STYLE</a></li><li><a href="global.html#props">props</a></li><li><a href="global.html#SERIES_LABEL_POSITION">SERIES_LABEL_POSITION</a></li><li><a href="global.html#transformData">transformData</a></li></ul>
</nav>

<div id="main">
    
    <h1 class="page-title">utils/axis.js</h1>
    

    



    
    <section>
        <article>
            <pre class="prettyprint source linenums"><code>import {SERIES_LABEL_POSITION} from '$ui/charts/utils/constant'
import isObject from 'lodash/isObject'
import {getLabelFormatter} from './util'


/**
 * 构建 坐标轴配置
 * @param direction
 * @param valueAxis
 * @param dimensions
 * @return {{yAxis: *, xAxis: *}}
 */
export function createAxis({direction, valueAxis}, {dimensions}) {
  
  // 默认维度的第一个是放置在类别轴
  const categoryAxis = dimensions[0] ? [{type: 'category'}] : undefined
  
  // 默认维度第二个开始是放置在值轴
  const defaultValueAxis = dimensions[1] || {}
  
  // 用户配置的值轴，支持多个值轴，最多只有2个
  const configValueAxis = valueAxis ? [].concat(valueAxis) : []
  
  // 用来存放最终的值轴配置
  let mergeValueAxis = [{type: 'value', axisLabel: getLabelFormatter(defaultValueAxis)}]
  
  // 用户配置了值轴
  if (configValueAxis.length) {
    // 用户配置与自动按维度生成的值轴合并
    mergeValueAxis = configValueAxis.map((item, index) => {
      // 用户配置的值轴，可以是字符串、对象、数组
      const axisOptions = isObject(item) ? item : {name: item}
      // 值轴的名称找到对应的维度配置
      const dimension = dimensions.find(n => [n.name, n.displayName].includes(axisOptions.name)) || {}
      // 用户配置的优先
      return {
        type: 'value',
        position: SERIES_LABEL_POSITION[direction][index],
        axisLabel: getLabelFormatter(dimension),
        ...axisOptions,
        // 兼容 name 和 displayName的设置
        name: dimension.displayName || dimension.name || axisOptions.name
      }
    })
  }
  // 按排列方向构建 x、y轴配置
  const isXCategory = direction === 'x'
  return {
    xAxis: isXCategory ? categoryAxis : mergeValueAxis,
    yAxis: !isXCategory ? categoryAxis : mergeValueAxis
  }
}

</code></pre>
        </article>
    </section>





    
</div>

<br class="clear">

<footer>
    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.4</a> on Wed Jun 10 2020 17:09:12 GMT+0800 (GMT+08:00) using the <a href="https://github.com/clenemt/docdash">docdash</a> theme.
</footer>

<script>prettyPrint();</script>
<script src="scripts/polyfill.js"></script>
<script src="scripts/linenumber.js"></script>




<script>
var _hmt = _hmt || [];
(function() {
  var hm = document.createElement("script");
  hm.src = "https://hm.baidu.com/hm.js?c4e5f73318b5cb0c389e3d9a05f831cc";
  var s = document.getElementsByTagName("script")[0];
  s.parentNode.insertBefore(hm, s);
})();
</script>

</body>
</html>
